<header data-am-widget="header" class="am-header am-header-default sq-head ">
	<div class="am-header-left am-header-nav">
		<a href="javascript:history.back()" class="">
			<i class="am-icon-chevron-left"></i>
		</a>
	</div>
	<h1 class="am-header-title">
		用户注册
	</h1>
</header>
<div style="height: 49px;"></div>
<!--<div class="login-logo">
	<img src="images/logo.png" />
</div>-->
<div style="height: 3rem;"></div>
<form action="" class="layui-form">
	<input type="text" name="username" value="xiaoxin" style="margin-bottom: 20px"  placeholder="请输入您的用户名" class="login-name">
	<input type="text" name="phone" value=""  placeholder="请输入手机号" id="a" class="login-name">
	<div class="yzm" style="margin-top: 1.5rem;">
		<img style="height: 50px;margin-left: 20px;width: 150px;" id="code" src="{:url('index/Reg/getCode')}" alt="">
		<input type="text" style="width: 200px" name="captcha" class="reg-yzm" placeholder="输入验证码" />
	</div>
	<div class="yzm" style="margin-top: 1.5rem;">
		<input type="text" style="width: 200px" class="reg-yzm" value="" name="phoneCode"  placeholder="输入手机验证码" />
		<input type="button" style="width: 150px;" class="yzm-hq" id="phoneCode" value="获取手机验证码" />
	</div>
	<input type="password" name="password" value="123123123"  placeholder="请输入密码" class="login-password">
	<input type="password" name="repassword" value="123123123"  placeholder="确认密码" class="login-name">
	<button class="login-btn" lay-submit lay-filter="a">立即注册</button>
<div class="agree">
	<div class="r-login">已有账号，请<a href="{:url('index/Login/index')}" class="l-login">登录</a></div>
</div>
</form>
<script>
    //Demo
    layui.use(['form','jquery'], function(){
        var form = layui.form;
        var $ = layui.jquery;
        $('#code').click(function () {
			$(this).attr('src',$(this).attr('src')+'?'+Math.random());
        })
		$('#phoneCode').click(function () {
		    captcha = $(this).parent().siblings().find('input').val();
		    if (captcha.length<3 || captcha.length>3){
                layer.msg('请填写正确的验证码', function(){});
                return;
			}
			phone = $(this).parent().siblings('input').eq(1).val();
		    if (phone.length<11 || phone.length>11){
                layer.msg('请填写正确的手机格式', function(){});
                return;
			}
            $.post("{:url('index/Reg/phoneCode')}",{captcha:captcha,phone:phone}, function(res) {
				if (res.code==0){
                    layer.msg(res.msg, {icon: 9},function () {
                    });
				}else{
                    layer.msg(res.msg, {icon: 1},function () {
                        a = setInterval(run,1000);
                    });
				}
            });
        })
		num = 58;
		function run(){
			num--;
            $('#phoneCode').attr('value',num+'秒后重新获取');
			if (num==0){
			    num=58;
                $('#phoneCode').attr('value','重新获取');
                clearInterval(a);
			}

		}
        //监听提交
        form.on('submit(a)', function(data){
            $.post("{:url('index/Reg/addUser')}",data.field, function(res) {
                if (res.code==1){
                    layer.alert(res.msg, {icon: 1},function (){
                    	location.href=("{:url('index/Login/index')}");
                    });
                }else{
                    $('#code').click();
                    layer.msg(res.msg, {icon: 9},function () {
                    });
                }
            });
            return false;
        });
    });
</script>